/*变量*/
@gray:#ededee;
@gray-dark:#d6d6d6;
@gray-text:#959595;
@blue:#4058c5;
/*混合*/
.block(@w,@h,@bgColor){
	width: @w;
	height: @h;
	background-color: @bgColor;
}
.radiusBlock(@w,@h,@bgColor,@radius){
	.block(@w,@h,@bgColor);
	/* Gecko browsers */
	-moz-border-radius: @radius; 
	/* Webkit browsers */
	-webkit-border-radius: @radius; 
	/* W3C syntax - likely to be standard so use for future proofing */
	border-radius:@radius;
}
.radius(@radius){
	/* Gecko browsers */
	-moz-border-radius: @radius; 
	/* Webkit browsers */
	-webkit-border-radius: @radius; 
	/* W3C syntax - likely to be standard so use for future proofing */
	border-radius:@radius;
}
.shadow(@offx,@offy,@blur-radius,@spread-radius,@color){
	-moz-box-shadow:@offx @offy @blur-radius @spread-radius @color ;              
    -webkit-box-shadow:@offx @offy @blur-radius @spread-radius @color ;           
    box-shadow:@offx @offy @blur-radius @spread-radius @color ;
}
.containTextCenter(@h){
	text-align: center;
	line-height: @h;
}
.clearFloatAfter{
	content: '.';
	height: 0;
	display: block;
	clear: both;
	visibility: hidden;
}
.box_shadow(@right: 0px, @bottom: 4px, @blur: 10px, @spread: 10px, @color: #9A9293){
	-webkit-box-shadow: @right @bottom @blur @spread @color;
	   -moz-box-shadow: @right @bottom @blur @spread @color;
	        box-shadow: @right @bottom @blur @spread @color;
}
/*全局*/
p,h3,h4,h5,a,li{
	font-family: "黑体";
}
body{
	min-width: 960px !important;
	background-color: @gray;
}
.header{
	width: 100%;
	margin-bottom: 20px;
}
.container{
	width: 80%;
}
/*header*/
//顶栏样式
#top_bar{
	height: 65px;
	width: 100%;

	.fixed_div{
		position: fixed;
		height: 65px;
		width: 100%;
		min-width: 960px;
		background-color: #5568D5;
		z-index: 10;
	}
	.fixed_div>div{
		margin-top: 15px;
		padding: 0;
	}
	.webTitle h2{
		margin-top: 0;
		color: #FFF;
		font: 33px/40px "Arial","Microsoft YaHei","黑体","宋体",sans-serif;
	}
	a{
		text-decoration: none;
	}
	.top_btn{
		padding: 7px 15px;
		font: 23px/40px "Arial","Microsoft YaHei","黑体","宋体",sans-serif;
		color: #BCBCBC;
		opacity: 0.7;
		cursor: pointer;		
		&.active{    //.top_btn .active
			color: #FFF;
			opacity: 1.0;
		}
		&.log_reg{
			display: none;
			color: #FFF;
			opacity: 1.0;
		}
	}
	.user{
		display: none;
		width: 185px;
		font: 21px "Arial","Microsoft YaHei","黑体","宋体",sans-serif;
		color: #DADADA;
		cursor: pointer;
		ul{
			width: 185px;
			list-style: none;
			padding: 0;
			background-color: #5568D5;
			z-index: 100;
			li{
				padding: 10px 0;
				border-top: 1px solid #7B8DB5;
				&.avatar_userName{
					border: 0px;
					padding: 6px 0 15px 2px;
					a{
						text-decoration: none;
						color: #DADADA;
					}
					.log_avatar{
						float: left;
						overflow: hidden;	
						width: 35px;
						height: 35px;
						margin-top: -3px;
						margin-right: 7px;
						img{
							width: 100%;
						}
					}
				}
				&.hidden_first{
					display: none;
				}
				.glyphicon{
					margin-left: 0;
					padding: 0 8px 0 12px;
					font-size: 18px;
				}
				&:hover{
					color: #FFF;
				}
			}
		}
	}
}

.modal{
	.modal-title{
		text-align: center;
		font: 40px "Microsoft YaHei","黑体","宋体",sans-serif;
	}
	.modal-body{
		.row{
			margin-top: 20px;
			.col-lg-3{
				text-align: right;
			}
			label{
				margin: 6px 20px 0 0;
				font-size: 18px;
			}
			.radio{
				display: inline-block; 
				width: 50px;
			}
			input{
				margin-left: -20px;
			}
			.col-lg-6 button{
				margin: 6px  0 15px 130px;
			}
			.error{
				width: 130px;	
				margin: 6px 0 0 -45px;
				img{
					width: 20px;
				}

			}
		}
		.other_login{
			margin: -5px 0 -10px 35px;
			div{
				width: 130px;
				height: 50px;
				margin: -5px 0 -5px 15px;
				a{
					&:first-child img{
						width: 22%;
					}
					&:nth-of-type(2) img{
						width: 45%;
					}
				}
			}
		}
		.imgButton{
			padding: 0;
			#uploadImg{
				display: none;
			}
			#hidden_form{
				display: none;
			}
		}
	}
}
/*画室首页*/
.contentContainer{
	padding:0 8.3%;
}
.studioInfoContainer{
	.radiusBlock(100%,100%,white,2px);
	.shadow(0,0px,1px,1px,@gray-dark);

	position: relative;
	padding: 20px;
	.studioAvaWrapper{
		.block(100px,100px,white);
		img{
			width:100%;
			height:100%;
		}
		margin:0 auto;
	}
	.studioName{
		margin: 20px auto;
		text-align: center;
		font-size: 25px;
	}
	.actionBtnGroup{
		width:230px;
		margin: 20px auto;
		button{
			width: 110px;
		}
	}
	.studioInfoList{
		width: 100%;
		list-style: none;
		padding: 0;
		li{
			display: inline-block;
			width: 100%;
			p{
				float: left;
			}
			a{
				float: right;
			}
		}

	}
}
.tabs{
	.block(100%,52px,white);
	.shadow(0,1px,2px,1px,@gray-dark);
	ul{
		margin: 0;
		padding: 0;
		list-style: none;
		li{
			@h:52px;
			.block(25%,@h,#f8f8f8);
			float: left;
			list-style: none;
			text-align: center;
			line-height: @h;
			padding: 0;
		}
		li.active{
			color:@blue;
		}
		li:after{
				background-color: @gray;  
				bottom: 0;  
				content: "";  
				display: block;   
				position: relative;  
				top: -41px;  
				left: 0px;
				width: 1px; 
				height: 30px;
			}
		li:hover{
			cursor: pointer;
		}
	}
}

#problems{
	.articles{
		//触发BFC模型，不会高度塌陷。
		float: left;
		//overflow: auto;	//用overflow会导致box-shadow无法正常显示
		margin-top: 25px;
		width: 100%;


		.left-col{
			float: left;
			position: relative;	//用于子元素绝对定位
			width: 13%;
			overflow: hidden;
			img{
				float: left;
				width: 75%;
			}
			.left-triangle{
				position: absolute;
				right: 0;
				top: 35%;
				width: 0;
				height: 0;
				border-right: 10px solid #FFF;
				border-top: 10px solid transparent;
				border-bottom: 10px solid transparent;
			}
		}
		.right-col{
			overflow: hidden;
			float: left;
			width: 87%;
			background-color: #FFF;
			.box_shadow(0px, 3px, 4px, -2px, #9C9C9C);

			.problem-details{
				width: 100%;
				padding: 0 3%;
				h5{
					margin: 5px 0;
					font: bold 16px "微软雅黑", "黑体","宋体",sans-serif;
					color: #2e2e2e;
				}
				h5:first-child{
					color: #445bc8;
					margin-top: 20px;
					font: 15px "微软雅黑", "黑体","宋体",sans-serif;
					a{
						text-decoration: none;
						color: #445bc8;
					}
				}
				h6{
					margin: 5px 0 13px 0;
					font: 14px "Arial","Microsoft YaHei","黑体","宋体",sans-serif;
					color: #959595;
					white-space: pre;
				}
				p{	//content
					a{
						text-decoration: none;
						white-space: pre;
					}
					margin-bottom: 15px;
					color: #2e2e2e;
					font: 15px "Arial","Microsoft YaHei","黑体","宋体",sans-serif;
					word-break: break-all;
				}
				.paintings{
					margin-right: -3%;
					img{
						width: 32.7%;
						padding-right: 3%;
					}
				}
				.tags-showAll{
					margin: 17px 0 13px 0;
					height: 20px;
					img{
						width: 17px;
					}
					.tags{
						position: relative;
						top: 2px;
						padding: 0 5px;
						font: 15px "黑体","宋体",sans-serif;
						color: #959595;
						&.viewNum{
							padding: 0;
						}
					}
					.showAll{
						float: right;
						text-decoration: none;
						margin-right: 6px;
						color: #3964CF;
						font: 17px/20px "黑体","宋体",sans-serif;
						cursor: pointer;
					}	
				}
			}
			.problem-comment{
				//overflow: auto;	//触发BFC
				div{
					float: left;
					width: 50%;
					height: 50px;
					text-align: center;
					border-top: 1px solid #CECECB;
					img{
						position: relative;
						top: 13px;
						width: 17px;
						cursor: pointer;
					}
					.num{
						position: relative;
						top: 15px;
						padding-left: 3px;
						font: 16px "Arial","Microsoft YaHei","黑体","宋体",sans-serif;
						color: #959595;
					}

				}
				.left-zan{
					border-right: 1px solid #CECECB;
				}
				.right-comment{
					a{
						text-decoration: none;
					}
				}
			}
		}
		.show-comments{
			float: right;
			width: 87%;
			margin: 12px 0 50px 0;
			.box_shadow(0px, 3px, 4px, -2px, #9C9C9C);
			.bottom-triangle{
				position: relative;
				left: 72.5%;
				width: 0;
				height: 0;
				border-bottom: 10px solid #FFF;
				border-left: 10px solid transparent;
				border-right: 10px solid transparent;	
			}
			.main-comments{
				width: 100%;
				.comment-content{
					overflow: hidden;		//触发BFC
					width: 100%;
					padding: 2px 0;
					background-color: #FFF;
					border-bottom: 1px solid #CECECB;

					.comment-left-col{
						float: left;
						overflow: hidden;
						width: 13%;
						margin-top: 10px;
						img{
							float: right;
							width: 57%;
							margin-right: 15%;
						}
					}
					.comment-right-col{
						float: left;
						overflow: hidden;
						width: 84%;
						p{
							a{
								text-decoration: none;
								white-space: pre;
							}
							margin-top: 10px;
							font: 15px "Arial","Microsoft YaHei","黑体","宋体",sans-serif;
							word-break: break-all;
							span{
								float: right;
								color: #3964CF;
								font: bold 15px "微软雅黑", "黑体","宋体",sans-serif;
								cursor: pointer;
							}
						}
						h5{
							margin: 15px 0 3px 0;
							font: 16px "黑体","宋体",sans-serif;
							a{
								color: #3964CF;
								text-decoration: none;
							}
						}
						h6{
							margin: 0 0 5px 0;
							font: 14px "Arial","Microsoft YaHei","黑体","宋体",sans-serif;
							color: #8F8F8D;
							white-space: pre;
						}
					}
				}
			}
			.information{
				background-color: #FFF;
				h2{
					margin: 0;
					display: none;
					text-align: center;
					font: 18px/50px "黑体","宋体",sans-serif;
				}
				div{
					textarea{
						display: block;
						width: 90%;
						height: 80px;
						margin-left: 5%;
						font: 15px "Arial","Microsoft YaHei","黑体","宋体",sans-serif;
						border: 1px solid #B2B2B2;
						background-color: #F3F3F3;
					}
					button{
						margin: 10px 0 10px 5%;
					}
				}
				.reply{
					display: none;
					.btn-default{
						margin-left: 5px;
					}
				}
			}
		}
	}
}
#works{
	.radiusBlock(100%,100%,white,2px);
	.shadow(0,0px,1px,1px,@gray-dark);
	padding: 20px;
	margin-top: 20px;
	.pic_row{
		.pic_row_itemWrapper{
			width: 33%;
			text-align:center;/*水平居中*/
			/*line-height: 200px;*//*垂直居中*/
			overflow: hidden;
			float: left;
			height: 0;
			padding-bottom: 33%;/*使得高等于宽*/
			margin: 0.25% 0.5% 0.25% 0;
			img{
				max-width:100%;
			}
		}	
		.pic_row_itemWrapper:last-child{
			margin-right: 0;
		}
	}
	.pic_row:after{
		.clearFloatAfter;
	}
}
#teachers{
	.radiusBlock(100%,100%,white,2px);
	.shadow(0,0px,1px,1px,@gray-dark);
	margin-top: 20px;
	.teacherlist{
		list-style: none;
		padding: 0;
		margin: 0;
		li{
			position: relative;
			display: block;
			@h:130px;
			height: @h;
			@pad:15px;
			padding: @pad;
			@imgSize:@h - (@pad *2);
			img{
				width:@imgSize;
				height:@imgSize;
				float: left;
			}
			h4,h5{
				position: absolute;
				bottom: @pad;
				left: @imgSize + @pad+10px;
				padding: 0;
				margin:0;
			}
			h4{
				bottom: @pad * 2.5;
			}
			h5{
				color: @gray-text;
			}
		}
		li:after{
			background-color: @gray;  
			bottom: 0;  
			content: "";  
			display: block;   
			position: absolute;  
			width: 100%; 
			height: 1px;
			clear: both;
			margin-top: 20px;
		}
	}
}
#videos{
	.radiusBlock(100%,100%,white,2px);
	.shadow(0,0px,1px,1px,@gray-dark);
	margin-top: 20px;
	.videolist{
		list-style: none;
		padding: 0;
		margin: 0;
		li{
			position: relative;
			display: block;
			@h:130px;
			height: @h;
			@pad:15px;
			padding: @pad;
			@imgSize:@h - (@pad *2);
			img{
				width:@imgSize;
				height:@imgSize;
				float: left;
			}
			h4,h5{
				position: absolute;
				bottom: @pad;
				left: @imgSize + @pad+10px;
				padding: 0;
				margin:0;
			}
			h4{
				bottom: @pad * 2.5;
			}
			h5{
				color: @gray-text;
			}
		}
		li:after{
			background-color: @gray;  
			bottom: 0;  
			content: "";  
			display: block;   
			position: absolute;  
			width: 100%; 
			height: 1px;
			clear: both;
			margin-top: 20px;
		}
	}
}
.tabs-body show{
	display: block;
}
.tabs-body{
	display: none;
}
.aside{
	.socialNum{
		.radiusBlock(100%,100px,transparent,2px);
		.shadow(0,0,2px,1px,@gray-dark);
		text-align: center;
		margin: 0;
		padding: 0;
		margin-bottom: 20px;
		.block(100%,80px,white);
		div{
			margin: 30px auto;
			span{
				font-weight:700;
				color: black;
			}
			color:@gray-text;
		}
		.fansNum:after{
			background-color: @gray;  
			bottom: 0;  
			content: "";  
			display: block;   
			position: absolute;  
			left: 100%;
			top: -15px;
			width: 1px; 
			height: 70px;
		}
	}
	.pageView{
		margin-bottom: 10px;
		padding: 20px;
		.radiusBlock(100%,134px,white,2px);
		.shadow(0,0,2px,1px,@gray-dark);
		color:@gray-text;
		.pageViewSection1{
			margin-bottom: 10px;
			span{
				color: black;
			}
		}
		.pageViewSection1:after{
			background-color: @gray;  
			bottom: 0;  
			content: "";  
			display: block;   
			position: relative;  
			width: 100%; 
			height: 1px;
			margin-top: 20px;
		}
		.pageViewSection2{
			a{
				display: block;
				margin-bottom: 5px;
				color:@gray-text;
			}
		}
	}
	.recruitBoard{
		margin-bottom: 10px;
		padding: 20px;
		.radiusBlock(100%,100%,white,2px);
		.shadow(0,0,2px,1px,@gray-dark);
		.recuitTitle{
			font-weight: 500;
			margin-top: 0px;
		}
		.recuitTitle:after{
			background-color: @gray;  
			bottom: 0;  
			content: "";  
			display: block;   
			position: relative;  
			width: 100%; 
			height: 1px;
			margin-top: 5px;
		}
		.recuitSection{
			.job{
				font-weight: 400;
			}
			.jobDescription{
				list-style: none;
				padding: 0;
				color: @gray-text;
			}
		}
		.recuitSection:after{
			background-color: @gray;  
			bottom: 0;  
			content: "";  
			display: block;   
			position: relative;  
			width: 100%; 
			height: 1px;
			margin-top: 5px;
		}
	}
}
/*视频弹窗*/
#videoModal{
	.modal-dialog{
		width: 900px;
		height: 490px;
	}

}
.videoContainer{
	.shadow(0,0,0px,0px,@gray-dark);
	border: none;
	background-color: transparent;
	width: 900px;
	height: 490px;
	position: relative;
	.leftBlock{
		background-color: white;
		width: 600px;
		height: 450px;
		margin: 40px 0 0 0;
		float: left;
	}
	#preview{
		width: 600px;
		height: 450px;
		position: absolute;
	}
	#playBtn{
		position: absolute;
		z-index: 5;
		left:278px;
		top: 228px;
		
	}
	.rightBlock{
		background-color: white;
		width: 275px;
		height: 450px;
		margin: 40px 0 0 0;
		float: right;
		padding: 20px;
		.rightBlockHeader{
			border-bottom: 1px solid @gray-dark;
		}
		.rightBlockAboutTeacher{
			margin: 10px 0;
			img{
				height: 60px;
				width: 60px;

			}
			border-bottom: 1px solid @gray-dark;
		}
	}
	.closeBtn{
		position: absolute;
		right: 0px;
		top: 0px;
		width: 110px;
		height: 40px;
		img{
			width: 30px;
			height: 30px;
			margin: 5px 5px 5px 0;
			display: inline;
		}
		p{	
			color: @gray;
			display: inline;
			cursor: pointer;
		}
	}
}

/*优秀画室页面*/
.studiosBlock{
	.radiusBlock(100%,100%,white,2px);
	.shadow(0,0px,1px,1px,@gray-dark);
	padding: 20px;
	.pic_row_5{
		width: 100%;
		.pic_row_item{
			width: 18%;
			float: left;
			margin: 0 2.5% 2.5% 0;
			.studioPic{
				width: 100%;
				height: 0;
				padding-bottom:100%;
				overflow: hidden;

				img{
					width: 100%;
				}
				p{
					text-align: center;
				}
			}
		}

		.pic_row_item:last-child{
			margin-right: 0;
		}
		margin:1% 0;
	}
}
.studiosBlock:after{
	.clearFloatAfter;
};
/*提问*/
.askContainer{
	width: 100%;
	height: 500px;
	.askHeader{
		padding: 0;
		margin: 0;
		@h:40px;
		.block(100%,@h,@blue);
		line-height: @h;
		border-radius:6px 6px 0 0;
		outline:0;
		.askTitle{
			margin-left: 2.5%*0.95;
			display: inline-block;
			color: white;
		}
		.closeAskModalBtn{
			background: url("../../image/closeAskModalBtn.png");
			margin-right: 8px;
			margin-top: 8px;
			float: right;
			width: 24px;
			height: 24px;
		}
	}
	.askBody{
		@w:95%;
		.askInput{
			margin: 0 auto;
			width: @w;
			#askTitleInput{
				.radiusBlock(100%,51px,#ececec,2px);
				border: 1px solid @gray-dark;
			}
			#askDescription{
				.radiusBlock(100%,51px,#ececec,2px);
				border: 1px solid @gray-dark;
				height: 150px;
				outline:none;
				resize:none;
			}
			.askLabel{
				display: inline-block;
			}
			.uploadMediaBtn{
				margin-top: 7px;
				margin-right: 5px;
				width: 28px;
				height: 22px;
				float: right;
			}
			.selectedFileName{
				margin-top: 7px;
				margin-right: 5px;
				float:right;
			}
			#uploadImg{
				background: url("../../image/insertImg.png");
			}
			#uploadVideo{
				background: url("../../image/insertVideo.png");
			}
			form{
				display: none;
			}
		}
		.askTagGroup{
			width: @w;
			margin: 0 auto;
			@tagHeight:28px;
			height: @tagHeight*3;
			.askTag{
				float: left;
				.radiusBlock(60px,@tagHeight,@gray,10px);
				color: #959595;
				.containTextCenter(@tagHeight);
				margin-right: 5px;
			}
			.askTag.selected{
				background-color: @gray-dark;
			}
		}
		.askTagGroup:after{
			content: '.';
			height: 0;
			display: block;
			clear: both;
			visibility: hidden;
		}
		.askAnonymity{
			width: @w;
			margin: 0 auto;
			input{

			}
		}
		.actionBtns{
			width: @w;
			margin: 20px auto;
			button{
				float: right;
				margin-left:5px;
			}
			#cancelBtn{

			}
		}
	}
}
/*画室环境弹窗*/
#environmentModal{
	.modal-dialog{
		height: 470px;
		width: 760px;
		padding-left: 42px;
		position: relative;
		#environment_tabs_con{
			.environment_tabs{

				left: 9px;
				position: absolute;
				height: 70px;
				width: 33px;
			}
			#environment_pic_tab{
				top: 0;
				background-image: url("../../image/environment_pic.png");
			}
			#comments_tab {
				top: 95px;
				background-image: url("../../image/environment_comment.png");
			}
			.active{
				left: 0px;
				height: 90px;
				width: 42px;
			}
			#environment_pic_tab.active{
				top: 0;
				background-image: url("../../image/environment_pic_active.png");
			}
			#comments_tab.active{
				top: 75px;
				background-image: url("../../image/environment_comment_active.png");
			}
		}
		.blackBg{
			background-color: #171717;
		}
		.whiteBg{
			background-color: #e6e6e6;
		}
		.environmentContainer{
			height: 470px;
			width: 760px;
			#closeEnvironmentModal{
				width: 25px;
				height: 24px;
				background:url("../../image/whiteClose.png");
				position: absolute;
				top: 0;
				right: 0;
				z-index: 15;
			}
			.environmentTabBody{
				display: none;
			}
			.show{
				display: block;
			}
			#myCarousel{
				.carousel-inner{
					width: 300px;
					height: 300px;
					text-align: center;
					line-height: 300px;
					margin: 20px auto;
					item{
						img{
							max-width: 300px;
							max-height: 300px;
						}
					}
				}
				.slideBtn{
					width: 20px;
					height: 32px;
					position: absolute;
					top:170px;
				}
				.slideBtn.left{
					left: 20px;
				}
				.slideBtn.right{
					right: 20px;
				}
				#thumbnails{
					position: relative;
					width: 760px;
					.thumbnailsControl{
						position: absolute;
						top: 30px;

					}
					.thumbnailsControl.left{
						left: 20px;
					}
					.thumbnailsControl.right{
						right: 20px;
					}
					.mycarousel-indicators{
						list-style: none;
						li{
							width: 70px;
							height: 70px;
							margin: 0 5px;
							text-align: center;
							line-height: 70px;
							background-color: white;
							float: left;
							img{
								max-width: 70px;
								max-height: 70px;
							}
						}
					}
				}

			}
			#comments{
				height: 470px;
				overflow: hidden;
				.commentActionBar{
					position: relative;
					z-index: 10;
					width: 100%;
					height: 53px;
					.whiteBg;

					button{
						float: left;
						height: 43px;
						width: 140px;
						margin: 5px 29px;
					}
					#cancelCommentBtn{
						float: right;
					}
					#commentInput{
						.radiusBlock(350px,49px,#ececec,2px);
						border: 1px solid @gray-dark;
						outline:none;
						resize:none;
						margin: 2px 0;
					}
				}
				#scrollBar{
					position: absolute;
					top: 53px;
					right: 10px;
					.radiusBlock(10px,370px,#b8b8b8,4px);
					#handle{
						position: absolute;
						.radiusBlock(10px,30px,#656565,4px);
					}
				}
				.commentsList{
					position: relative;
					.commentBlock{
						width: 700px;
						margin: 0 auto;
						padding:10px 0;
						border-bottom: 1px solid @gray-dark;
						.left-avatar{
							width: 33px;
							float: left;
							img{
								max-width: 33px;
								max-height: 33px;
								margin-top: 10px;
							}
						}
						.right-text{
							width:655px;
							float: left;
							margin-left: 12px;
							.userName{
								font-size: 14px;
								color: @blue;
							}
							.time{
								font-size: 12px;
								color: @gray-text;
							}
							.commentContent{
								font-size: 15px;

							}
						}
					}
					.commentBlock:after{
						.clearFloatAfter;
					}
				}

			}
		}

	}
}

/*footer*/
.footer{
	.block(100%,170px,white);
	font-family: "黑体","宋体",sans-serif;
	margin-top: 20px;
	padding:20px;
	border-top: 2px solid @gray-dark;
	.footerContent{
		width: 80%;
		height: 130px;
		position: relative;
		margin: 0 auto;
		.footerList{
			list-style: none;
			padding: 0;
			float: left;
			li{
				margin: 10px 0;
			}	
		}
		.icp{
			color: @gray-dark;
			position: absolute;
			bottom: 0;
			left: 0;
		}
		h2{
			color: @blue;
			position: absolute;
			bottom: 0px;
			right: 0px;
		}

	}

}